/**
 * Created by SylarSong on 16/12/7.
 */

//************获取图标实例******************
var login_active_user = echarts.init($('#login-active-user')[0]); // 登录用户活跃度


$(document).ready(function () {
    render_chart();
    $('#search-btn').click(function(){
        render_chart();
    })
});

//!!!!!!!!!!!页面尺寸改变事件!!!!!!!!!!!!!!
window.onresize = function () {
    $('#login-active-user').width($(".grid-12") - 50);
    login_active_user.resize();
};

//*登录玩家+游戏用户********************************************
function get_login_active_user(instance,data) {
    option = {
        title: {
            text: '登录玩家 & 游戏用户'
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['登录玩家', '游戏玩家']
        },
        toolbox: {
            feature: {
                saveAsImage: {}
            }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: [
            {
                type: 'category',
                boundaryGap: false,
                data: data['dates']
            }
        ],
        yAxis: [
            {
                type: 'value'
            }
        ],
        series: [
            {
                name: '登录玩家',
                type: 'line',
                stack: '总量',
                areaStyle: {normal: {}},
                data: data['login']
            },
            {
                name: '游戏玩家',
                type: 'line',
                stack: '总量',
                areaStyle: {normal: {}},
                data: data['game']
            }
        ]
    };
    instance.setOption(option);
    instance.hideLoading();
}

function render_chart(){
    var url = '/stats_ajax/user/retention';
    var date = $('#date').val();
    var params = {
        'date': date,
        '_': $.now()
    };
    login_active_user.showLoading();
    $.get(url, params, function(data){
        get_login_active_user(login_active_user, data);
    })
}





